<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

		<title></title>
		<script src="../../js/mui.min.js"></script>
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<!--App自定义的css-->
		<link rel="stylesheet" href="../../css/mui.min.css">
		<link rel="stylesheet" href="../../css/global.css">
		<link rel="stylesheet" type="text/css" href="../../css/app.css" />
		
		<script src="../../js/getURLParam.js"></script>
	</head>

	<body>
		<div class="mui-content fongtstyle" style="margin-top: 0;">
			<ul class="mui-table-view">
				<li class="mui-table-view-cell">
					<span>严重故障（包含红色）</span>
					<div id="red" class="mui-switch mui-active">
						<div class="mui-switch-handle"></div>
					</div>
				</li>
				<li class="mui-table-view-cell">
					<span>黄色故障（可能降扭）</span>
					<div id="yelp" class="mui-switch mui-active">
						<div class="mui-switch-handle"></div>
					</div>
				</li>
				<li class="mui-table-view-cell">
					<span>黄色故障（不会降扭）</span>
					<div id="yeln" class="mui-switch mui-active">
						<div class="mui-switch-handle"></div>
					</div>
				</li>
				<li class="mui-table-view-cell">
					<span>其他故障</span>
					<div id="other" class="mui-switch mui-active">
						<div class="mui-switch-handle"></div>
					</div>
				</li>
			</ul>
			<br />
			<div class="mui-content" style="margin: 0px;" >
				<button  type="button" class="mui-btn mui-btn-primary mui-btn-block" onclick="saveSwitch()">保存设置</button>
			</div>
		</div>
		
		<div id="error"></div>
		<div>
		  <input type="hidden" id="redv" value="0"/>
		  <input type="hidden" id="yelpv" value="0"/>
		  <input type="hidden" id="yelnv" value="0"/>
		  <input type="hidden" id="otherv" value="0"/>
		</div>
		<script>
			mui.init({
				swipeBack: true //启用右滑关闭功能
			});
			var sessionid=GetQueryString("sessionid");
			var accountid=GetQueryString("accountId");
	        var proversion=GetQueryString("proVersion");
	        var red = document.getElementById("red");
	        var yelp = document.getElementById("yelp");
	        var yeln = document.getElementById("yeln");
	        var other = document.getElementById("other");
	        var redv = document.getElementById("redv");
	        var yelpv = document.getElementById("yelpv");
	        var yelnv = document.getElementById("yelnv");
	        var otherv = document.getElementById("otherv");
	        mui.ajax('../../../APP/getSwitch', {
				data: {
					param: '{"proVersion":"' + proversion + '","accountId":"' + accountid + '","sessionid":"' + sessionid + '"}'
				},
				dataType: 'jsonp', //服务器返回json格式数据
				type: 'post', //HTTP请求类型
				timeout: 10000, //超时时间设置为10秒；
				success: function(data) {
					var jsonObj = window.JSON.parse(data);
					if (jsonObj.resultCode == "1") {
						//获取返回数据的data
						var resultdata = jsonObj.data;
						if (null != resultdata) {
							for(var i=0;i<resultdata.length;i++){
								if(resultdata[i].lv2=="1"){//红色故障
									redv.value=resultdata[i].stat;
									if(redv.value=="1"){
										red.className="mui-switch mui-active";
									}else{
										red.className="mui-switch";
									}
								}
								if(resultdata[i].lv2=="2"){//黄色故障（可能降扭）
									yelpv.value=resultdata[i].stat;
									if(yelpv.value=="1"){
										yelp.className="mui-switch mui-active";
									}else{
										yelp.className="mui-switch";
									}
								}
								if(resultdata[i].lv2=="3"){//黄色故障（不会降扭）
									yelnv.value=resultdata[i].stat;
									if(yelnv.value=="1"){
										yeln.className="mui-switch mui-active";
									}else{
										yeln.className="mui-switch";
									}
								}
								if(resultdata[i].lv2=="4"){//其他故障
									otherv.value=resultdata[i].stat;
									if(otherv.value=="1"){
										other.className="mui-switch mui-active";
									}else{
										other.className="mui-switch";
									}
								}
								
							}
						} else {
						}
			
					} else {
					}
				},
				error: function(xhr, type, errorThrown) {
				}
			});
			mui('.mui-content .mui-switch').each(function() { //循环所有toggle
				/**
				 * toggle 事件监听
				 */
				this.addEventListener('toggle', function(event) {
					//event.detail.isActive 可直接获取当前状态
					if(event.target.id === 'red'){
						if(event.detail.isActive){
							redv.value="1";							
						}else{
							redv.value="0";
						}
					}
					if(event.target.id === 'yelp'){
						if(event.detail.isActive){
							yelpv.value="1";							
						}else{
							yelpv.value="0";
						}
					}
					if(event.target.id === 'yeln'){
						if(event.detail.isActive){
							yelnv.value="1";							
						}else{
							yelnv.value="0";
						}
					}
					if(event.target.id === 'other'){
						if(event.detail.isActive){
							otherv.value="1";							
						}else{
							otherv.value="0";
						}
					}
					mui.toast(event.detail.isActive ? '已开启' : '已关闭');
				});
			});
			function saveSwitch(){
				var err = document.getElementById("error");
				var redv = document.getElementById("redv").value;
		        var yelpv = document.getElementById("yelpv").value;
		        var yelnv = document.getElementById("yelnv").value;
		        var otherv = document.getElementById("otherv").value;
		        var stat = ' [{"lv1":"1","lv2":"1","stat":"'+redv+'"},{"lv1":"1","lv2":"2","stat":"'+yelpv+'"},{"lv1":"1","lv2":"3","stat":"'+yelnv+'"},{"lv1":"1","lv2":"4","stat":"'+otherv+'"}]'
		       	mui.ajax('../../../APP/updateSwitch', {
					data: {
						param: '{"proVersion":"' + proversion + '","accountId":"' + accountid + '","sessionid":"' + sessionid + '","data":' + stat + '}'
					},
					dataType: 'jsonp', //服务器返回json格式数据
					type: 'post', //HTTP请求类型
					timeout: 10000, //超时时间设置为10秒；
					success: function(data) {
						var jsonObj = window.JSON.parse(data);
						if (jsonObj.resultCode == "1") {
							mui.toast("保存成功!");
						} else {
							mui.toast("保存失败!");
						}
						window.webkit.messageHandlers.saveSwitch.postMessage("1");
					}
					
				});
			}
		</script>
	</body>

</html>